<template>
  <div class="info">
    <div class="title">基本注册信息</div>
    <div class="table">
      <tr>
        <td class="key-title">法人代表：</td>
        <td>{{ detail.oper_name }}</td>
        <td class="key-title">统一社会信用代码</td>
        <td>{{ detail.credit_code}}</td>
      </tr>
      <tr>
        <td class="key-title">企业（机构）类型： </td>
        <td>{{ detail.econ_kind }}</td>
        <td class="key-title">注册资本币种： </td>
        <td>{{ detail.regist_capi_unit}}</td>
      </tr>
      <tr>
        <td class="key-title">经营期限：</td>
        <td>{{ detail.term_start }} 至 {{ detail.term_end }}</td>
        <td class="key-title">注册机关</td>
        <td>{{ detail.belong_org }}</td>
      </tr>
      <tr>
        <td class="key-title">实收资本： </td>
        <td>{{ detail.rec_cap }}</td>
        <td class="key-title">核准日期</td>
        <td>{{ detail.check_date }}</td>
      </tr>
      <tr>
        <td class="key-title">员工人数：</td>
        <td>0</td>
        <td class="key-title">经营场所</td>
        <td>{{ detail.region }}</td>
      </tr>
      <!-- <tr>
        <td colspan="1" class="key-title">曾用名：</td>
        <td colspan="3">{{ detail.original_name }}</td>
      </tr>
      <tr>
        <td colspan="1" class="key-title">经济行业分类</td>
        <td colspan="3">{{ detail.industry }}</td>
      </tr> -->
      <tr>
        <td colspan="1" class="key-title">经营（业务）范图</td>
        <td colspan="3">{{ detail.scope }}</td>
      </tr>
    </div>
    <div class="title top-20">股东信息</div>
    <el-table
      :data="gudongxinxi"
      style="width: 100%"
      class="top-20 table-customize"
    >
      <el-table-column
        prop="StockName"
        label="投资人姓名"
        min-width="150"
      >
      </el-table-column>
      <el-table-column
        prop="ShouldCapi"
        label="认缴出资额"
      >
      </el-table-column>
      <el-table-column
        prop="StockPercent"
        label="出资比例"
      >
      </el-table-column>
      <el-table-column
        prop="ShoudDate"
        label="认缴出资时间"
      >
      </el-table-column>
      <el-table-column
        prop="StockType"
        label="投资人类型"
      >
      </el-table-column>
    </el-table>
    <div class="title top-20">注册变更历史</div>
    <el-table
      :data="biangenglishi"
      style="width: 100%"
      class="top-20"
    >
      <el-table-column
        prop="ProjectName"
        label="变更事项"
        min-width="150"
      >
      </el-table-column>
      <el-table-column
        label="变更前列表"
        min-width="150"
      >
        <template slot-scope="{row}">
          <span v-for="(item, index) in row.BeforeList" :key="`BeforeList${index}`">
            <template v-if="index > 0">，{{ item }}</template>
            <template v-else>{{ item }}</template>
          </span>
        </template>
      </el-table-column>
      <el-table-column
        label="变更后列表"
        min-width="150"
      >
        <template slot-scope="{row}">
          <span v-for="(item, index) in row.AfterList" :key="`AfterList${index}`">
            <template v-if="index > 0">，{{ item }}</template>
            <template v-else>{{ item }}</template>
          </span>
        </template>
      </el-table-column>
      <el-table-column
        label="变更前内容列表"
        min-width="150"
      >
        <template slot-scope="{row}">
          <span v-for="(item, index) in row.BeforeInfoList" :key="`BeforeInfoList${index}`">
            <template v-if="index > 0">，{{ item.Content }}{{ item.Name }}</template>
            <template v-else>{{ item.Content }}{{ item.Name }}</template>
          </span>
        </template>
      </el-table-column>
      <el-table-column
        label="变更后内容列表"
        min-width="150"
      >
        <template slot-scope="{row}">
          <span v-for="(item, index) in row.AfterInfoList" :key="`AfterInfoList${index}`">
            <template v-if="index > 0">，{{ item.Content }}{{ item.Name }}</template>
            <template v-else>{{ item.Content }}{{ item.Name }}</template>
          </span>
        </template>
      </el-table-column>
      <el-table-column
        prop="ChangeDate"
        label="变更日期"
      >
      </el-table-column>
    </el-table>
  </div>
</template>
<script>

export default {
  data() {
    return {
      //
    }
  },
  props: {
    detail: {
      default() {
        return []
      }
    },
    gudongxinxi: {
      dafault() {
        return []
      }
    },
    biangenglishi: {
      dafault() {
        return []
      }
    }
  },
  created() {
    //
  },
  methods: {
    //
  }
}
</script>

<style lang="scss" scoped>
.info {
  .top-20 {
    margin-top: 20px;
  }
  .title {
    font-size: 24px;
    font-weight: bold;
    color: #000000;
    line-height: 60px;
    border-bottom: 1px solid #e7e7e7;
  }
  .table {
    margin-top: 20px;
    border-left: 1px solid #e7e7e7;
    border-top: 1px solid #e7e7e7;
    .key-title {
      background-color: #F5F7FA;
      color: #000000;
      min-width: 10rem;
    }
    tr {
      td {
        border: 1px solid #e7e7e7;
        border-left: none;
        border-top: none;
        color: #303133;
      }
    }
  }
}
</style>

<style>
.el-table thead {
  color: #2F3133;
}
.el-table th {
  background-color: #F5F7F9;
}
</style>
